<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page isELIgnored="false" %>
<html>
<head>
    <meta charset="utf-8">
    <title>013项目 </title>
    <link rel="icon" type="image/x-icon"
    href="/static/img/0131.png"/>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/css/login.css" />
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/bootstrap/js/bootstrap.min.js"></script>
    <script>
        $(document).ready(function() {
            //打开会员登录
            $("#Login_start_").click(function() {
                $("#regist_container").hide();
                $("#_close").show();
                $("#_start").animate({
                    left: '350px',
                    height: '520px',
                    width: '400px'
                }, 500, function() {
                    $("#login_container").show(500);
                    $("#_close").animate({
                        height: '40px',
                        width: '40px'
                    }, 500);
                });
            });
            //打开会员注册
            $("#Regist_start_").click(function() {
                $("#login_container").hide();
                $("#_close").show();
                $("#_start").animate({
                    left: '350px',
                    height: '520px',
                    width: '400px'
                }, 500, function() {
                    $("#regist_container").show(500);
                    $("#_close").animate({
                        height: '40px',
                        width: '40px'
                    }, 500);
                });
            });
            //关闭
            $("#_close").click(function() {

                $("#_close").animate({
                    height: '0px',
                    width: '0px'
                }, 500, function() {
                    $("#_close").hide(500);
                    $("#login_container").hide(500);
                    $("#regist_container").hide(500);
                    $("#_start").animate({
                        left: '0px',
                        height: '0px',
                        width: '0px'
                    }, 500);
                });
            });
            //去 注册
            $("#toRegist").click(function(){
                $("#login_container").hide(500);
                $("#regist_container").show(500);
            });
            //去 登录
            $("#toLogin").click(function(){
                $("#regist_container").hide(500);
                $("#login_container").show(500);
            });
        });
    </script>

</head>
<%--<body style="background-color: red/*#000000*/;" >--%>
<body style="background: url(/static/img/meinv.png) no-repeat">
    <center>
        <a id="Login_start_" class="btn btn-danger" style="width:100px;height:40px;border-radius: 0; margin-bottom: 50px">登陆</a>
        <a id="Regist_start_" class="btn btn-success" style="width:100px;height:40px;border-radius: 0; margin-bottom: 50px">注册</a>
    </center>
    <form action="/login" method="post">
    <!-- 会员登录  -->
    <!--<div id='Login_start' style="position: absolute;" >-->
    <div id='_start'>
        <div id='_close' style="display: none;">
            <span class="glyphicon glyphicon-remove"></span>
        </div>
        <br />
        <!--登录框-->
        <div id="login_container">
            <div id="lab1">
                <span id="lab_login">项目登录</span>
                <span id="lab_toRegist">
				&emsp;还没有账号&nbsp;
				<span id='toRegist' style="color: #EB9316;cursor: pointer;">立即注册</span>
			</span>
            </div>
            <div style="width:330px;">
                <span id="lab_type1">手机号/账号登陆</span>
            </div>
            <div id="form_container1">
                <br />
                <input type="text" class="form-control" name="usercode" placeholder="手机号/用户名" id="usercode" value="admin" />
                <input type="password" class="form-control" name="password" placeholder="密码" id="password" />
                <input type="submit" value="登录" class="btn btn-success" id="login_btn" />
                <span id="rememberOrfindPwd">
				<span>
					<input id="remember" type="checkbox" style="margin-bottom: -1.5px;">
				</span>
			<span style="color:#000000">
					记住密码&emsp;&emsp;&emsp;&emsp;
				</span>
			<span style="color:#000000">
					忘记密码
				</span>
			</span>
            </div>

            <div style="display:block;width:330px;height：40px;">
                <span id="lab_type2">使用第三方直接登陆</span>
            </div>
            <div style="width:330px;height:100px;border-bottom: 1px solid #FFFFFF;">
                <br />
                <button id="login_QQ" type="button" class="btn btn-info">
                    <img src="/static/img/qq32.png" style="width:20px;margin-top:-4px;" />手机登录
                </button>
                <button id="login_WB" type="button" class="btn btn-danger">
                    <img src="/static/img/sina32.png" style="width:20px;margin-top:-4px;" />&emsp;微博登录
                </button>
            </div>
        </div>
    </div>
    </form>
        <div id='_start1'>
            <!-- 会员注册 -->
            <form action="/logins" method="post">
                <div id='regist_container' style="display: none;">
                    <div id="lab1">
                        <span id="lab_login">会员注册</span>
                        <span id="lab_toLogin">
				&emsp;已有账号&nbsp;
				<span id='toLogin' style="color: #EB9316;cursor: pointer;">立即登录</span>
			</span>
                    </div>
                    <div id="form_container2" style="padding-top: 25px;">

                        <input type="text" class="form-control"name="usercode"  placeholder="用户名" id="regist_account">
                        <input type="password" class="form-control" name="password" placeholder="密码" id="regist_password1" />
                        <input type="password" class="form-control" name="password" placeholder="确认密码" id="regist_password2" />
                        <input type="text" class="form-control" name="username" placeholder="名称" id="regist_username" />
                        <input type="text" class="form-control" name="email" placeholder="邮箱" id="regist_email" />
                        <input type="text" class="form-control" placeholder="手机号" id="regist_phone" />
                        <input type="text" class="form-control" placeholder="验证码" id="regist_vcode" />
                        <!--<button id="getVCode" type="button" class="btn btn-success" >获取验证码</button>-->
                        <input id="getVCode" type="button" class="btn btn-success" value="点击发送验证码" />

                    </div>
                    <input type="submit" value="注册" class="btn btn-success" id="regist_btn" />
                </div>
            </form>
        </div>

    <script type="text/javascript">
        var id;//定制器的id,停止定时地需要
        var count=60;//倒计时的时间,单位秒
        $(function () {
            $("#getVCode").click(function () {
                //获取手机号
                var regist_phone = $("#regist_phone").val();
                if (regist_phone.length == 0) {
                    alert("手机号不能为空!");
                    return;
                }
                //禁用按钮
                $(this).attr("disabled", "disabled");
                //启动倒计时
                id = setInterval("time()", 1000);
                //发送ajax请求
                $.getJSON("/sendCode", {regist_phone: regist_phone}, function (result) {
                    if (result.msg == "OK") {
                        alert("验证码已发送");
                    } else {
                        alert(result.msg);
                    }
                });
            });
            $("#regist_btn").click(function(){
                var  regist_vcode=$("#regist_vcode").val();
                $.getJSON("/logins",{regist_vcode:regist_vcode},function (result) {

                    if(result.msg=="ok"){
                        location.href="/jsp/success.jsp";
                    }else{
                        alert(result.msg);
                    }
                })
            })
        });
        var count=60;
        function time() {
            count--;
            if(count==0){
                $('#getVCode').removeAttr("disabled");
                count=60;
                $('#getVCode').val("重新发送");
                //停止计时
                clearInterval(id);
            }else{
                $('#getVCode').val(count+'s后,重新发送');
            }
        }

        $(document).ready(function(){
            $("#login_QQ").click(function(){
                alert("暂停使用！");
            });
            $("#login_WB").click(function(){
                alert("暂停使用！");
            });
        });

    </script>

   <%-- <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';color:#ffffff">
        <p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、谷歌、世界之窗. 不支持IE8及以下浏览器。</p>
        <p>来源：<a href="https://gitee.com/a013project/uperproject" target="_blank">013NumberOne小组</a></p>
    </div>

--%>
</body>
</html>